/*
 *
 * 页面头部
 *
 * */
'use strict';
var React = require('react');
var ReDialog = require('./ReDialog.jsx');
class HkfsHeader extends React.Component {
    constructor(props) {
        super(props);
        this.renderLeft = this.renderLeft.bind(this);
        this.renderRight = this.renderRight.bind(this);
        this.state = {
            configuredItems: [{
                content: '登录',
                contentHref: '/login'
            }, {
                content: '注册',
                contentHref: '/register'
            }, {
                content: '手机客户端',
                imgHref: '/images/pc/header_APP.png',
                contentClick: this.alertCode
            }]
        }
    }

    logOut() {
        sessionStorage.removeItem("HkfsUserPhone");
        location.reload(true);
        //通过ajax消除登录记录
        reqwest({
            url: '/api/logout',
            method: 'post',
            contentType: 'application/json'
        });
    }

    alertCode(){
        ReDialog.showDialog({
            title: '扫码下载华财通手机客户端',
            isOk: false,
            content: <img src="images/pc/footer_download_app.png"/>,
            isMask: true,
            isCancel: false,
            dialogWidth: '350px',
            dialogHeight: '350px',
            result: (result)=> {
            }
        });
    }

    //检测session判断用户登录状态
    componentDidMount() {
        //此处添加随机数的版本号，坑爹的ie同一个请求会缓存结果，导致无法获取后台数据
        var random= Math.random();
        var self = this;
        reqwest({
            url: `/api/checkLogin?version=${random}`,
            method: 'get',
            contentType: 'application/json'
        })
            .then(function (data) {
                if (data.userId) {
                    self.setState({
                        configuredItems: [{
                            content: data.userId
                        }, {
                            content: '退出',
                            contentClick: self.logOut
                        }, {
                            content: '手机客户端',
                            imgHref: '/images/pc/header_APP.png',
                            contentClick: self.alertCode
                        }]
                    });
                }
            })
            .fail(function (err, msg) {
                alert('服务器出错');
            });

    }

    //左端头部
    renderLeft() {
        return this.props.leftData.map((item, i)=> {

                if (item.contentHref) {
                    return item.imgHref ?
                        <span key={"HkfsHeaderLeftItem"+i}><img src={item.imgHref}/><a
                            href={item.contentHref}>{item.content}</a></span> :
                        <span key={"HkfsHeaderLeftItem"+i}><a href={item.contentHref}>{item.content}</a></span>;
                }
                else {
                    return item.imgHref ?
                        <span key={"HkfsHeaderLeftItem"+i}><img src={item.imgHref}/><span>{item.content}</span></span> :
                        <span key={"HkfsHeaderLeftItem"+i}>{item.content}</span>;
                }

            }
        );
    }


    //右端头部
    renderRight(data, keyContent) {
        return data.map((item, i)=> {
                if (item.contentClick) {
                    return item.imgHref ?
                        <span key={"HkfsHeaderLeftItem"+i}><img src={item.imgHref}/><span><a href="#" onClick={item.contentClick}>{item.content}</a></span></span> :
                        <span key={"HkfsHeaderLeftItem"+i}><a href="#" onClick={item.contentClick}>{item.content}</a></span>;
                }
                else {
                    if (item.contentHref) {
                        return item.imgHref ?
                            <span key={keyContent+i}><img src={item.imgHref}/><a href={item.contentHref}>{item.content}</a></span> :
                            <span key={keyContent+i}><a href={item.contentHref}>{item.content}</a></span>;
                    }
                    else {
                        return item.imgHref ?
                            <span key={"HkfsHeaderItem"+i}><img src={item.imgHref}/><span>{item.content}</span></span> :
                            <span key={keyContent+i}>{item.content}</span>;
                    }
                }
            }
        );
    }

    render() {
        return (
            <div className="HkfsHeader_Container">
                <div className="HkfsHeader_Center">
                    <div className="HkfsHeader_Left">
                        {this.renderLeft()}
                    </div>
                    <div className="HkfsHeader_Right">
                        {this.renderRight(this.state.configuredItems, 'configuredItems')}
                        {this.renderRight(this.props.rightData, 'HkfsHeaderRightItem')}
                    </div>
                </div>
                <ReDialog></ReDialog>
            </div>
        );
    }
}

module.exports = HkfsHeader;